<style lang="less">
    @import './index.less';
</style>

<template>
  <div>
    <Card>
      <Table ref="table" :columns="columns1" :data="contractList"></Table>
    </Card>
    <Modal v-model="dealModal" title="合同审批">
      <p>请输您对【{{dealMes.customer_name}}】的合同审批意见：</p>
      <br>
      <Input type="textarea" :rows="4" placeholder="处理意见。。。" v-model="view"></Input>
      <div slot="footer">
          <Button type="primary" size="large" @click="pass">审核通过</Button>
          <Button type="error" size="large"  @click="refuse">驳回</Button>
      </div>
    </Modal>
  </div>
</template>

<script>
export default {
  data() {
    return {
      dealModal:false,
      dealMes:{},
      selection:[],
      contractList:[],
      view:'',
      columns1:[
        {
          title:'合同编号',
          key:'contract_number',
          align:'center',
          render:(h,params) => {
            if(params.row.contract_number) {
              return h('span',{},params.row.contract_number)
            }else {
              return h('span',{},'暂无合同编号')
            }
          }
        },
        {
          title:'合同名称',
          key:'contract_name',
          align:'center'
        },
        {
          title:'合同负责人',
          key:'responsible_name',
          align:'center'
        },
        {
          title:'合同申请人',
          key:'creator',
          align:'center'
        },
        {
          title:'合作公司',
          key:'customer_name',
          align:'center'
        },
        {
          title:'合同金额',
          key:'money',
          align:'center'
        },
        {
          title:'合同起始时间',
          key:'contract_end_date',
          align:'center'
        },
        {
          title:'合同结束时间',
          key:'contract_start_date',
          align:'center'
        },
        {
          title:'操作',
          align:'center',
          render: (h,params) => {
            return h('div', [
                h('Tooltip', {
                  props: {
                    placement: 'top',
                    content: '详细信息'
                  }
                }, [h('Button', {
                  props: {
                    size: 'small',
                    icon: 'qr-scanner',
                    type: 'text'
                  },
                  on: {
                    click: () => {
                      this.$router.push({
                        name:'contract_contract-check-detail',
                        params:{id:params.row.businessKey}
                      })
                    }
                  }
                })]),
                h('Tooltip', {
                  props: {
                    placement: 'top',
                    content: '处理'
                  }
                }, [h('Button', {
                  props: {
                    size: 'small',
                    icon: 'settings',
                    type: 'text'
                  },
                  on: {
                    click: () => {
                      this.dealHandle(params.row);
                    }
                  }
                }
                )])
              ]);
          }
        }
      ]
    }
  },
  methods:{
    getChecks() {
      this.contractList=[];
      this.$flowHttp.get('/flow/tasks').then((res) => {
        _.forEach(res.data.data,item => {
          if(item.form.category === 'contract-approval') {
            item.form["task"]=item.taskId;
            this.contractList.push(item.form)
          }
        })
      })
    },
    dealHandle(mes) {
      this.dealModal = true
      this.dealMes = mes
    },
    pass() {
      this.dealModal = false
      this.$flowHttp.post('/flow/process?task=' + this.dealMes.task,{'action':'PASS','comment':this.view}).then((res) => {
        this.$Message.success('您的审核意见已经提交')
        this.getChecks();
      })
      this.view = ''
    },
    refuse() {
      this.dealModal = false
      this.$flowHttp.post('/flow/process?task=' + this.dealMes.task,{'action':'REJECT','comment':this.view}).then((res) => {
        this.$Message.info('您驳回了该条审核，该条审核将会重新回到申请人。')
        this.getChecks() 
      })
      this.view = ''
    }
  },
  mounted() {
    this.getChecks()  
  }
}
</script>
